function IDropable()
{
	this.dragEnter = function(event)
	{
	    // highlight
	    event.target.className = "drop-valid";

	    // stop default
	    event.stopPropagation(); 
	    event.preventDefault();

	    return false;
	};

	this.dragOver = function(event)
	{
		// highlight
	    event.target.className = "drop-valid";

	    // stop default
	    event.stopPropagation(); 
	    event.preventDefault();

	    return false;
	};

	this.dragLeave = function(event)
	{
	    // remove highlight
	    event.target.className = "";

	    // stop default
	    event.stopPropagation(); 
	    event.preventDefault();

	    return false;
	};

	this.drop = function(event)
	{
	    // stop default and stop event bubbling
	    event.preventDefault();
		event.stopPropagation(); 

	    // update position
	    var data = event.dataTransfer.getData('text/plain').split(',');
	    
	    var src = document.getElementById(data[0]);
	    src.style.left = (event.clientX + parseInt(data[1],10)) + 'px';
	    src.style.top = (event.clientY + parseInt(data[2],10)) + 'px';

	    // append child
	    event.target.className = "";
	    event.target.appendChild(src);

	    return false;
	};
}